<template>
<div class="user-manage">
  <search-table :url="url" ref="searchtable" :columns="columns" :form="form">
    <template slot="searchForm">
      <a-form layout="inline" :form="form">
        <a-form-item label="用户姓名">
          <a-input
            v-decorator="[
              'name',
            ]"
            placeholder="请输入用户姓名"
          >
          </a-input>
        </a-form-item>
      </a-form>
    </template>
    <template slot="oprationRow">
      <permission authority="users:add">
        <a-button type="primary" icon="plus" @click="openInfo()">添加</a-button>
      </permission>
      <permission authority="users:roles:choose">
        <a-button @click="deleteRows($refs.searchtable.selectedRowKeys)" type="danger" icon="delete">删除</a-button>
      </permission>
    </template>
    <template slot="tableOperation" slot-scope="{record}">
      <permission authority="users:modify">
        <span class="text-primary pointer" @click="openInfo(record)">修改</span>
      </permission>
      <a-divider type="vertical" />
      <permission authority="users:delete">
        <span class="text-danger pointer" @click="deleteRows([record.id])">删除</span>
      </permission>
      <a-divider type="vertical" />
      <permission authority="users:password:change">
        <span class="text-primary pointer" @click="openEditPasModal(record)">修改密码</span>
      </permission>
      <a-divider type="vertical" />
      <permission authority="users:password:reset">
        <span class="text-danger pointer" @click="resetPas(record)">重置密码</span>
      </permission>
      <a-divider type="vertical" />
      <permission authority="users:roles:choose">
        <span class="text-primary pointer" @click="openChooseRoleModal(record)">选择角色</span>
      </permission>
    </template>
  </search-table>
  <user-info :record="currentRecord" @cancel="closeInfoModal" :visible="infoVisible" />
  <edit-pas :record="currentRecord" @cancel="closeEditPasModal" :visible="editPasVisible" />
  <choose-role :record="currentRecord" @cancel="closeChooseRoleModal" :visible="chooseRoleVisible" />

</div>
</template>
<script>
import UserInfo from './components/UserInfo'
import EditPas from './components/EditPas'
import ChooseRole from './components/ChooseRole'
export default {
  name: 'Role',
  data () {
    return {
      url: '/sys/users',
      infoVisible: false,
      editPasVisible: false,
      chooseRoleVisible: false,
      currentRecord: {},
      form: this.$form.createForm(this, { name: 'table_search' }),
      columns: [
        {
          title: '用户名',
          dataIndex: 'account',
          key: 'account'
        },
        {
          title: '用户姓名',
          dataIndex: 'name',
          key: 'name'
        },
        {
          title: '创建时间',
          dataIndex: 'createDate',
          key: 'createDate'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          scopedSlots: { customRender: 'operation' }
        }
      ]
    }
  },
  components: {
    UserInfo,
    EditPas,
    ChooseRole
  },
  mounted () {
  },
  methods: {
    resetPas (record) {
      this.$confirm({
        title: '重置密码',
        okText: '确认',
        cancelText: '取消',
        centered: true,
        content: '确认将密码重置为“123456”？',
        onOk: () => {
          return new Promise((resolve, reject) => {
            this.$post(`/sys/users/${ record.id }/password/reset`).then(res => {
              if (res && res.returnCode === 1000) {
                this.$message.success('密码重置成功')
                resolve()
              } else {
                reject()
              }
            }).catch(() => reject())
          })
        }
      })
    },
    closeInfoModal (freshTable) {
      this.infoVisible = false
      if (freshTable) {
        this.$refs.searchtable.refreshTable()
      }
    },
    openInfo (record) {
      this.currentRecord = record
      this.infoVisible = true
    },
    closeEditPasModal () {
      this.editPasVisible = false
    },
    openEditPasModal (record) {
      this.currentRecord = record
      this.editPasVisible = true
    },
    closeChooseRoleModal () {
      this.chooseRoleVisible = false
    },
    openChooseRoleModal (record) {
      this.currentRecord = record
      this.chooseRoleVisible = true
    },
    deleteRows (ids) {
      if (!ids || ids.length === 0) return this.$message.warn('请先选择一项后再进行操作')
      this.$confirm({
        title: '删除提示',
        content: '删除操作不可恢复，请确认是否删除？',
        okText: '确认删除',
        cancelText: '取消',
        onOk: () => {
          this.$post('/sys/users/delete', ids).then(res => {
            if (res && res.returnCode == 1000) {
              this.$message.success('删除成功')
              this.$refs.searchtable.refreshTable()
            }
          })
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>

</style>
